<template>
  <div>
    <table-ext :columns="columns" :searchForm="searchForm" :config="config" ref="tableExt">
    </table-ext>
  </div>
</template>

<script>
  import TableExt from '@/components/common/table-ext/table-ext.vue';
  import TableIcon from '@/components/common/table-ext/table-icon';
  export default {
    components:{
      'table-ext': TableExt
    },
    data() {
      return {
        userOptions: [{
          value: '-1',
          label: '系统管理员'
        }],
        config:{
          title: '招标项评标', //页面标题
          isPage: true, //是否分页
          isNo: true, //是否显示序号
          selection: false, //是否显示复选框
          crudMapping:{ // CRUD方法
            query:{
               //url: this.lib.config.host.bidtender + '/bidmgt/view/query',
               url: this.lib.config.host.bidtender + '/bidmgt/view/queryEvaluation',
               data:{}
            }
          }
        },
        formLabelWidth: '120px',
        // 查询表单配置
        searchForm:[
          //显示标签 数据字段 标签类型
          {label: '招标编号', key: 'psNo', type: 'input'},
          {label: '项目名称', key: 'psTitle', type: 'input'},
          {label: '评标状态',key: 'evaluationStatus',type: 'select', 
            dict: [
              {value:'全部',key:''},
              {value:'未评标',key:'0'},
              {value:'技术待评',key:'3'},
              {value:'商务待评',key:'4'},
              {value:'已完成',key:'1'},
            ]
          },
        ],
        // 表格列定义
        columns:[{ 
          label: '操作', // 表格header
          align:'center',
          widht:'50',
          render:(createElement, params)=>{ // 动态渲染，click事件示例
            let _this = this;
            console.log(params.row.evaluationStatus);
            let status=params.row.evaluationStatus===3?1:params.row.evaluationStatus===4?2:0;
            let button=status!==0?createElement('el-button', 
                { props: { type: 'text' },
                  on: {
                    click() {
                      const {href} = _this.$router.resolve({
                        name: 'EvaluationStep',
                        query:{'step':status,'id':params.row.id}
                      })
                      window.open(href, '_blank');
                    } 
                  }
                },'评分'):'';
            return createElement('div', {}, 
              [button]
            );
          }
        },
        {label: '供货区域',key: 'purOrgName',align:'center', widht:'120'},
        {label: '招标编号',key: 'psNo',align:'center', widht:'100'},
        {label: '项目名称',key: 'psTitle',align:'left', widht:'160'},
        {label: '评标',key: 'evaluationStatus',align:'center',render:(createElement, params)=>{ 
          return createElement(TableIcon,{props:{
              flag: params.row.publishStatus,
              titles: [{status:0,title:'未评标'},{status:1,title:'已评标'},{status:3,title:'商务待标'},{status:4,title:'技术待评'}]
          }});
        }},
        {label: '评标截止期限',key: 'evaluationEtime',align:'center', widht:'120'},
        {label: '负责人',key: 'leaderUserName',align:'center', widht:'80'}
        ]
      };
    },
    created(){
      if(this.$route.query){
        this.config.crudMapping.query.data = this.$route.query;
      }
    },
    mounted(){ // VUE页面渲染之后调用的方法
      this.initData();
    },
    methods: {
      // 初始化页面数据
      initData(){
        
      },
      createBid(){
        this.$router.push({name:'creatBid'});
      },
    }
  }

</script>